<template>
  <div>
    <ul>
        <li>
          <img :src="url.img" alt="">
        </li>
        <li>
            <van-search v-model="value" placeholder="请输入搜索关键词" shape="round" background="#eee"/>
        </li>
        <li>
          <van-icon name="service-o" />
        </li>
    </ul>
  </div>
</template>

<script>
import service from '@/utils/service';
export default {
  data(){
    return {
      value:"",
      url:""
    }
  },
  mounted(){
    service({
      url:"http://localhost:3000/head_search",
      method:"get",
    }).then((res)=>{
      res.data.forEach(element => {
        this.url = element
      });
    })
  }
}
</script>

<style scoped>
ul {
  display: flex;
  align-items: center;
  justify-content: space-around;
  background: #eee;
  height: 40px;
  overflow: hidden;
}
img {
  width: 40px;
  height: 32px;
}
</style>